.main {
  .topPageSet{
    margin: 20rpx;
    .topPageSet-item{
      flex: 4;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      height: 180rpx;
      background:#FFFFFF;
      transition:0.3s;
      position: relative;
      box-sizing: border-box;
      border-radius: 20rpx;
      border: 4rpx solid #fff;
      margin:0 8rpx;
      .tips{
        position: absolute;
        right:0;
        top:0;
        color:#fff;
        width: 64rpx;
        height: 35rpx;
        border-radius: 0rpx 10rpx 0rpx 20rpx;
        background: #3662EC;
        font-family: Source Han Sans;
        font-size: 24rpx;
        font-weight: 500;
        line-height: normal;
        text-align: center;
        letter-spacing: normal;
        color: #FFFFFF;
      }
      .topPageSet-img{
        width: 60rpx;
        height: 60rpx;
      }
      .topPageSet-label{
        font-family: Source Han Sans;
        font-size: 28rpx;
        font-weight: bold;
        line-height: normal;
        text-align: center;
        letter-spacing: normal;
        color: #3F3F3F;
        
      }
    }
    .active{
      flex: 11 !important;
      border: 4rpx solid #3662EC;
    }
  }
  .tabBtn {
	  padding:0 30rpx;
    border-radius: 40rpx;
    font-size: 30rpx;
    border: 1rpx solid #2A6DDE;
    background: rgba(42, 109, 222, 0.12);
    color: #2A6DDE;
    margin-right: 20rpx;
	flex-shrink: 0;
  }
  
  .tabBtn-act {
    background: #2A6DDE;
    color: #FFFFFF;
  }
  
  .header-box {
    height: 281rpx;
    box-sizing: border-box;
    background: linear-gradient(90deg, #BAE2F9 0%, #F1CEEE 100%);
    border-radius: 30rpx;
    padding: 33rpx 33rpx 20rpx 33rpx;
    color: #085285;
    font-size: 26rpx;
    position: relative;
    z-index: 10
  }
  
  .listScreen {
    position: sticky;
    z-index: 10;
    height: 120rpx;
    background-color: #fff;
  
    .listScreen-item {
      font-size: 28rpx;
      // width: 250rpx;
	  width:max-content
    }
    .active_color {
      color: #085285;
    }
    
    .unactive_color {
      color: #838587;
    }
  }
  .font-w {
    font-weight: bold;
  }
}
view {
  box-sizing: border-box;
}

.money {
  width: 710rpx;

  border-radius: 20rpx;
  background: #FFFFFF;
  box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(0, 0, 0, 0.3);
  margin: 20rpx auto 0;

  .money-top {
    .total-text {
      font-size: 30rpx;
      font-weight: normal;
      color: #5B5B5B;
    }

    .guarantee {
      width: 267rpx;
      height: 40rpx;
      border-radius: 16rpx;
      background: #FEF0EF;
      font-size: 28rpx;
      font-weight: normal;
      line-height: 33rpx;
      text-align: center;
      color: #9E9E9E;

      .guarantee-icon {
        width: 26rpx;
        height: 26rpx;
        margin-right: 10rpx;
      }
    }

    .withdraw {
      font-size: 30rpx;
      font-weight: normal;
      color: #3922E5;
    }
  }

  .total-money {
    font-size: 72rpx;
    font-weight: 500;
    color: #1E1E1E;
  }

  .money-item {
    width: 50%;
    font-size: 30rpx;
    font-weight: normal;
    color: #9E9E9E;

    text {
      color: #1E1E1E;
    }
  }
}
.tabs {
  margin-top: 50rpx;
  

  .tabs-item {
    font-size: 28rpx;
    font-weight: normal;
    color: #B0B0B0;
    margin-right: 30rpx;
    text-align: center;
  }
  .tab-active {
    font-size: 36rpx !important;
    font-weight: 500 !important;
    color: #1855FF !important;
  }
}
.sub-title-sticky {
  position: sticky;
  z-index: 15;
  background: #f6f6f6;
  height: 30px;
  line-height: 30px;
}
.title-sticky {
  position: sticky;
  z-index: 10;
  background: #fff;
}
.list {
  width: 710rpx;
  max-height: 552rpx;
  border-radius: 20rpx;
  background: #FFFFFF;
  box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(0, 0, 0, 0.3);
  margin: 30rpx auto 0;

  .time {
    font-size: 28rpx;
    font-weight: normal;
    color: #1E1E1E;
  }

  .income {
    font-size: 28rpx;
    font-weight: normal;
    color: #B0B0B0;
  }

  .list-scroll {
    width: 100%;
    max-height: 474rpx;

    .item {
      width: 100%;
      height: 117rpx;
      border-bottom: 1rpx solid #ACACAC;

      .item-left {
        width: 100%;
        height: 117rpx;

        .item-left-icon {
          width: 72rpx;
          height: 72rpx;
          margin-right: 20rpx;
        }

        .item-name {
          font-size: 32rpx;
          font-weight: normal;
          color: #1E1E1E;
        }

        .item-time {
          font-size: 28rpx;
          font-weight: normal;
          color: #A9A9A9;
        }

        .item-money {
          font-size: 36rpx;
          font-weight: 500;
          color: #1E1E1E;
        }
      }


    }
  }
}
.year {
  width: 710rpx;
  height: 283rpx;
  border-radius: 20rpx;
  background: #FFFFFF;
  box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(0, 0, 0, 0.3);
  margin: 30rpx auto 0;

  .year-title {
    font-size: 28rpx;
    font-weight: normal;
    color: #1E1E1E;
  }

  .year-total {
    font-size: 28rpx;
    font-weight: normal;
    color: #B0B0B0;
    margin-top: 47rpx;
  }

  .year-money {
    color: #1E1E1E;
    font-weight: 700;
    font-size: 50rpx;
    margin-top: 26rpx;
  }
  
}